<template>
  <div class="management">
    <div class=" bfff" style="box-sizing: border-box;">
      <div style="height: 1px;background: #EFEFEF;width:100%"></div>
      <uv-tabs lineWidth="120rpx" :itemStyle="{fontSize: '32rpx', height: '86rpx' }" :customStyle="{ height: '86rpx' }" @click="tabTap" :scrollable="false" :current="current" :inactiveStyle="{ color: '#898989' }" :activeStyle="{ color: '#333' }" lineColor="#333" border :list="[{name: '退货地址'}, {name: '电子面单发货地址'}]"></uv-tabs>
      <div style="height: 1px;background: #EFEFEF;width:100%"></div>
    </div>
    <div class="h100 oy">
      <view v-if="current == 0" class="h100 ">
        <div class="common-empty" v-if="tableData.length === 0">
          <uv-empty mode="address" text="没有退货地址" />
        </div>
        <div class="   pt30 bfff mb20" v-for="(item, index) in tableData" :key="index">
          <div class="pl30 pr30 pb30">
            <div class=" fz30">{{item.fullAddress}}</div>
            <div class="pt20 fz28" style="color: #9FA0A0">{{item.name}} &nbsp;&nbsp;&nbsp;{{item.tel}}</div>
          </div>
          <div class=" f pl30 pr30 aic jcsb pt20 pb20 fz28" style="border-top: 1px solid #EFEFEF">
            <div>
              <uv-radio-group @change="isDefaultTap(item)" shape="circle" size="32rpx" v-model="item.is_default" labelSize="28rpx" labelColor="#333">
                <uv-radio :labelColor="item.is_default == 1 ? '#E60012' : '#979898'" :class="item.is_default == 1 ? 'active' : ''" activeColor="#E60012" label="已设为默认" :name="String(1)"></uv-radio>
              </uv-radio-group>
            </div>
            <div style="color: #9FA0A0" class="fz28">
              <div @click="delTap(item)" class="dib">删除</div>
              <div @click="uni.navigateTo({ url: '/pages-merchant/address/addNew?current=' + current + '&id=' + item.id })" class="dib pl30">修改</div>
            </div>
          </div>
        </div>
      </view>
      <view v-else class="oy" style="height: calc(100vh - 45px - 142rpx - 86rpx)">
        <div v-if="tableData1.length === 0" class="common-empty">
          <uv-empty mode="address" text="没有电子面单发货地址" />
        </div>
      </view>
    </div>
    <button-lst text="新增地址" @submit="uni.navigateTo({ url: '/pages-merchant/address/addNew?current=' + current })"></button-lst>
  </div>
</template>
<script>
import { returnAddressList, returnAddressDefault, returnAddressDel } from "@/api/merchant.js";
import commonButtonVue from "../components/commonButton.vue";
export default {
  components: {
       "button-lst": commonButtonVue,

  },
  data() {
    return {
      routeQuery: {}, mainHeight: 0,
      page: 1,
      limit: 50,
      tableData: [],
      tableData1: [],
      current: 0,
      isOnShow: false
    }
  },
  onLoad(options) {
    if (options) this.routeQuery = options
    this.initPage()
  },
  onShow() {
    if (this.isOnShow) this.initPage()
  },
  onHide() {
    this.isOnShow = true
  },
  methods: {
    delTap(item) {
      uni.showModal({
        title: '提示', content: '确认删除该地址吗', success: (res) => {
          if (!res.confirm) return
          returnAddressDel(item.id).then(res1 => {
            if (res1.code === 200) {
              this.initPage()
              uni.$uv.toast('删除成功')
            }
          })
        }
      })
    },
    isDefaultTap(item) {
      this.$nextTick(() => {
        returnAddressDefault({ id: item.id, is_default: item.checked ? 0 : 1 }).then(res => {
          if (res.code === 200) this.initPage()
        })
      })
    },
    tabTap(value) {
      this.current = value.index
      let t = this.routeQuery.t || ''
    },
    initPage() {
      uni.showLoading({ title: '加载中', mask: true })
      returnAddressList().then(res => {
        if (res.code === 200) {
          this.tableData = res.result.map(item => {
            item.fullAddress = item.province + item.area + item.city + item.address
            item.is_default = String(item.is_default)
            if (item.is_default == 1) item.checked = true
            return item
          })
          uni.hideLoading()
        }
      })
    }
  }

}
</script>
<style lang="scss" scoped>
@import "../common.scss";
page {
  background-color: #f7f8f8;
  color: #333;
  font-weight: normal;
}
.management {
  height: calc(100vh - 44px);
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
</style>